<template>
  <div class="app-container" v-table-height="{callback: height => minHeight = height}" :style="{height: minHeight + 'px'}">
      <el-tabs v-model="activeTab">
        <el-tab-pane label="基本信息" name="userinfo">
          <userInfo :user="user" />
        </el-tab-pane>
        <el-tab-pane label="账户安全" name="security">
          <userSafe :user="user" />
        </el-tab-pane>
      </el-tabs>
  </div>
</template>

<script>
import userInfo from "./userInfo";
import userSafe from "./userSafe";
import { getUserProfile } from "@/api/system/user";

export default {
  name: "center",
  components: { userInfo,userSafe },
  data() {
    return {
      user: {},
      roleGroup: {},
      postGroup: {},
      activeTab: "userinfo",
      minHeight: 0
    };
  },
  created() {
    this.getUser();
  },
  methods: {
    getUser() {
      getUserProfile().then(response => {
        this.user = response.data;
        this.roleGroup = response.roleGroup;
        this.postGroup = response.postGroup;
      });
    }
  }
};
</script>
